<template>
  <view class="body">
    <u-divider
      text="识别内容"
      textColor="#2979ff"
      lineColor="#ff0000"
    ></u-divider>
    <u--textarea
      v-model="content"
      placeholder="请点击按钮扫描二维码"
    ></u--textarea>
    <u-divider
      text="wifi名称"
      textColor="#2979ff"
      lineColor="#ff0000"
    ></u-divider>
    <u--input border="surround" v-model="wifiname"></u--input>
    <u-divider text="密码" textColor="#2979ff" lineColor="#ff0000"></u-divider>
    <u-input v-model="password"
      ><template slot="suffix">
        <u-button @click="copyText" text="一键复制"></u-button> </template
    ></u-input>
    <view style="padding: 20rpx 0"
      ><u-button
        @click="scanCodeBtn"
        type="primary"
        icon="wifi"
        text="扫一扫"
      ></u-button
    ></view>
	<view style="font-size:24rpx;color:#f56c6c;">温馨提示：此功能有一定的局限性，适用于忘记已连接过的wifi密码和通过二维码识别分享的密码。指引如下：</view>
  <view>
	<view style="font-size:32rpx;padding:20rpx 0;">1.打开手机设置界面,找到WLAN</view>
	<img src="./imgs/11.jpg" style="width:242px;height:528px" alt="">
  </view>
  <view>
	<view style="font-size:32rpx;padding:20rpx 0;">2.点击已连接的wifi,将会显示二维码界面</view>
	<img src="./imgs/22.jpg" style="width:242px;height:528px" alt="">
  </view>
  <view>
	<view style="font-size:32rpx;padding:20rpx 0;">3.将二维码页面截图保存</view>
	<img src="./imgs/33.jpg" style="width:242px;height:528px" alt="">
  </view>
  <view>
	<view style="font-size:32rpx;padding:20rpx 0;">4.扫一扫这个二维码</view>
	<img src="./imgs/44.jpg" style="width:242px;height:528px" alt="">
  </view>
  </view>
</template>


<script>
export default {
  data() {
    return { content: "", wifiname: "", password: "" };
  },
  methods: {
    scanCodeBtn() {
      uni.scanCode({
        success: (res) => {
          if (res.result) {
            console.log("扫描结果：", res.result);
            this.content = res.result;
            const ssidMatch = this.content.match(/S:([^;]+)/);
            const passwordMatch = this.content.match(/P:([^;]+)/);

            this.wifiname = ssidMatch ? ssidMatch[1] : null;
            this.password = passwordMatch ? passwordMatch[1] : null;
          } else {
            uni.showToast({
              title: "扫描失败",
              icon: "none",
            });
          }
        },
        fail: (err) => {
          if (err.errMsg.includes("cancel")) {
            uni.showToast({
              title: "扫描已取消",
              icon: "none",
            });
          } else {
            uni.showToast({
              title: "调用相机失败",
              icon: "none",
            });
          }
        },
      });
    },
	copyText() {
      uni.setClipboardData({
        data: this.wifiname + "\n" + this.password,
        success: function () {
          uni.showToast({
            title: "复制成功",
          });
        },
      });
    },
  },
  onLoad() {},
  onShow() {},
};
</script>

<style scoped lang="scss">
.body {
  padding: 0 36rpx;
}
</style>